import React, { Component } from 'react';
import { WingBlank } from 'antd-mobile';
import {Link} from 'react-router-dom'
import { FormOutlined, GlobalOutlined, } from '@ant-design/icons';

export default class MsgCard extends Component {
    render() {
        return (
            <div>
                <WingBlank>
                    <div style={{ height: 38, display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
                        <div style={{ height: 38, display: 'flex', alignItems: 'center' }}>
                            <div style={{ width: 8, height: 8, backgroundColor: '#55efc4', borderRadius: 4 }}></div>
                            <div style={{ marginLeft: 6 }}>在线人数：</div>
                            <div style={{ fontSize: 16, fontWeight: 'bold', color: '#108ee9' }}>12</div>
                        </div>

                        <div style={{ color: '#108ee9', fontSize: 16 }}>
                            <GlobalOutlined /> 聊天室
                    </div>
                    <Link to='addcontent'>
                            <div style={{ color: '#636e72', fontSize: 15, height: 35, width: 80, backgroundColor: '', display: 'flex', alignItems: 'center', justifyContent: 'center', boxShadow: '0 0 8px #ccc', borderRadius: 20 }}>
                                <FormOutlined style={{ marginRight: 5 }} /> 发帖
                    </div>
                    </Link>
                       
                    </div>
                </WingBlank>
            </div>

        )
    }
}
